.flex(@x:center;@y:center){display:flex;justify-content:@x;align-items:@y;}
.flex-col(@x:center;@y:center){display:flex;flex-direction:column;justify-content:@x;align-items:@y;}

.bdr{border:1px solid #fff;}
.bdra(@r:4px){border-radius:@r;}

.abs{position:absolute;}
.abs(@x){position:absolute;top:@x;left:@x;right:@x;bottom:@x;}
.abs(@y;@x){position:absolute;top:@y;left:@x;right:@x;bottom:@y;}
.abs(@t;@m;@b){position:absolute;top:@t;left:@m;right:@m;bottom:@b;}
.abs(@t;@r;@b;@l){position:absolute;top:@t;left:@l;right:@r;bottom:@b;}

.fix{position:fixed;}
.fix(@x){position:fixed;top:@x;left:@x;right:@x;bottom:@x;}
.fix(@y;@x){position:fixed;top:@y;left:@x;right:@x;bottom:@y;}
.fix(@t;@m;@b){position:fixed;top:@t;left:@m;right:@m;bottom:@b;}
.fix(@t;@r;@b;@l){position:fixed;top:@t;left:@l;right:@r;bottom:@b;}

.grid(@colNum:2;@colSize:20px;@rowNum:2;@rowSize:20px){
  display:grid;
  grid-template-columns:repeat(@colNum, @colSize);
  grid-template-rows:repeat(@rowNum, @rowSize);
}

.els{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.elss(@row:2){
  overflow: hidden;
  display: -webkit-box;//将元素设为盒子伸缩模型显示
  -webkit-box-orient: vertical;//伸缩方向设为垂直方向
  -webkit-line-clamp: @row;//超出3行隐藏，并显示省略号
}

.clearfix{
  &::after{content:'';display:block;clear:both;}
}

.title(@size:30px){font-weight:702; font-family:'Object Sans Bold'; font-size:@size;}
.titleX(@size:30px){font-weight:702; font-family:'Object Sans Bold'; font-size:@size; font-style:italic;}
